import React from "react";

import { storiesOf } from "@storybook/react";
import { text, select } from "@storybook/addon-knobs";
// import { withSmartKnobs } from 'storybook-addon-smart-knobs'


import Divider from ".";

const boolVariants = {
  true: true,
  false: false,
};

const typeVariants = {
  horizental: "horizental",
  vertical: "vertical",
};

const placementVariants = {
  left: "left",
  right: "right",
  center: "center",
};

storiesOf("Divider", module)
  .add("Divider", () => (
    <div className=''>
      left
      <Divider
        type={select("Type", typeVariants, "horizental")}
        dashed={select("Dashed", boolVariants, true)}
        children={text('Children', 'Informational Notes')}
        placement={select("Placement", placementVariants, 'left')}
        onClick={() => alert('click')}
      />
      right
    </div>
  ));